<template>
	<view class="content">
		<view class="nav-flex">
			<view>原始延期：</view>
			<view>{{list.oldDelayTime}}</view>
		</view>
		
		<view class="nav-flex uni-flex">
			<view>延期时长：</view>
			<input type="number" v-model="delayApplyLength" placeholder="请输入正整数" />
			
			<radio-group name="radio" @change="radioChange">
				<label v-if="type == 1">
					<radio value="1" checked />
					<text>天</text>
				</label>
				<label v-else>
					<radio value="1" />
					<text>天</text>
				</label>
			
				<label v-if="type == 2" style="margin-left: 25upx;">
					<radio value="2" checked="" />
					<text>小时</text>
				</label>
				<label v-else style="margin-left: 25upx;">
					<radio value="2" />
					<text>小时</text>
				</label>
			</radio-group>
		</view>
		<view class="nav-flex">
			<view>延期理由：</view>
			<textarea maxlength="-1" type="text" v-model="delayRemark" placeholder="请输入延期理由" />
		</view>
		<view class="nav-flex" @click="uploading()">
			<view>延期附件：</view>
			<view v-if="oneDelayFuJian">{{oneDelayFuJian}}</view>
			<view v-else>上传附件</view>
		</view>
		
		<view class="submit" @click="submit()">确认</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderID:'',
				oldDelayTime:'',//原始延期时间
				list:[],
				delayApplyLength:'',//延期时长
				delayRemark:'',//申请理由
				oneDelayFuJian:'',//附件
				type:2
			}
		},
		onLoad(e) {
			this.orderID = e.orderID
			this.list = JSON.parse(e.list)
			
			this.delayApplyLength = this.list.delayApplyLength
			this.delayRemark = this.list.delayRemark
			this.oneDelayFuJian = this.list.oneDelayFuJian
		},
		methods: {
			// 下面的是上传照片
			uploading() {
				let that = this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ["camera", "album"], //从相册选择
					success: function(res) {
						let file = res.tempFilePaths[0];
						// 下面是临时使用的方法
						// let file = res.tempFiles[0].path;
						uni.showLoading({
							mask: false
						});
						uni.uploadFile({
							url: '/app/system/upload', //仅为示例，非真实的接口地址
							filePath: file,
							name: 'file',
							success: uploadFileRes => {
								uni.hideLoading();
								const res = JSON.parse(uploadFileRes.data);
								// console.log(res)
								uni.showToast({
									title: res.message,
									icon: 'none'
								});
								// that.handleFu = file;
								that.oneDelayFuJian = res.data.fileId;
								// console.log(that.handleFu, '这是图片文件id');
							}
						});
					}
				});
			},
			
			// 选择时间
			radioChange: function(e) {
				var checked = e.target.value;
				console.log('时间 1 天 2 小时 ===>' + checked);
				this.type = checked;
			},
			
			// 提交
			submit() {
				var that = this;
				var ret = /^[1-9]*[1-9][0-9]*$/
				if (!that.delayApplyLength || !ret.test(that.delayApplyLength)) { 
				　　uni.showToast({
						title:'请输入正整数!',
						icon:'none',
						duration:1500
					})
					return　　
				} 
				if(!that.delayRemark){
					uni.showToast({
						title:'请输入延期理由!',
						icon:'none',
						duration:1500
					})
					return　
				}
				var times = 0
				if(that.type==1){
					times = that.delayApplyLength * 24
				}else if(that.type==2){
					times = that.delayApplyLength
				}
				uni.showLoading({
					mask: false
				})
				uni.request({
					url: '/app/wechatApi/wechatOneFiveOrder/handleOrder',
					method: 'POST',
					data: {
						orderId: that.orderID,
						openid: uni.getStorageSync('openid'),
						delayApplyLength: times,
						delayRemark: that.delayRemark,
						oneDelayFuJian: that.oneDelayFuJian,
						handlePoint:'delay',
					},
					header: {
						'Content-type': 'application/x-www-form-urlencoded'
					},
					success: res => {
						uni.hideLoading()
						if (res.data.code === 200) {
							uni.showToast({
								title:'延期成功!',
								icon:'none'
							})
							setTimeout(function(){
								uni.navigateBack({
									delta:2
								})
							},1500)
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'none'
							});
						}
					},
					error: e => {
						console.log(e);
					}
				});
			}
		}
	}
</script>

<style lang="less">
.content{
	padding: 1upx;
	
	.nav-flex{
		display: flex;
		box-shadow: 0px 0px 4px 4px rgba(0, 1, 2, 0.08);
		margin: 25upx;
		padding: 25upx;
		border-radius: 15upx;
		white-space: nowrap;
		
		textarea {
			width: 70%;
			color: #666;
			font-size: 30upx;
			height: 100upx;
			text-align: justify;
		}
		
		input{
			font-size: 28upx;
		}
	}
	
	// 提交
	.submit {
		background: #48E6E7;
		color: #ffffff;
		text-align: center;
		padding: 10upx 0;
		margin: 25upx;
		margin-top: 150upx;
		border-radius: 25upx;
	}
}
</style>
